<template>
    <div class="">
        <h2>姓名:{{ person.name }}</h2>
        <h2>年龄：{{ person.age }}</h2>
        <button @click="changeAge">点击修改年龄</button>
    </div>
</template>

<script lang="ts" setup>
import { ref, reactive, toRaw,markRaw } from "vue"

let person = reactive({
    name: 'tony',
    age: 18
})

let person2 = toRaw(person)
console.log(person2);

//markRaw 定义的数据不能被改变的
let name = markRaw({name:'小白'})
console.log(name);




function changeAge() {
    person.age += 1
}
</script>

<style lang="scss" scoped></style>
